<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>用户任务列表详情</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="/wlzz/css/font.css">
    <link rel="stylesheet" href="/wlzz/css/xadmin.css">
    <script type="text/javascript" src="/wlzz/js/jquery.min.js"></script>
    <script type="text/javascript" src="/wlzz/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="/wlzz/js/xadmin.js"></script>
    <style>
        #input_user_info{
            width: 500px;
            margin: 10px 0px 10px 30px;
        }
    </style>
    <script>
        layui.use('element', function(){
            var element = layui.element;

        });
        function searchTask() {
            var input_task = document.getElementById("input_task").value;
            if(input_task==""){
                layer.msg('请输入搜索内容', {icon: 2});
                return;
            }
            var index = layer.load(2, {time: 7*1000,shade:0.5});
            $.post("/wlzz/backstage/search_task",
                    {input_task:input_task},function(data){
                        console.log(data);
                        if(data.code==0){
                            var content = ' <tr id="'+data.data.task._id+'">'+
                                    '                    <td style="width: 7%">'+data.data.userid+'</td>'+
                                    '                    <td style="width: 10%">'+data.data.nickName+'</td>'+
                                    '                    <td style="width: 10%">'+data.data.task._id+'</td>'+
                                    '                    <td style="width: 20%">'+data.data.task.title+'</td>'+
                                    '                    <td style="width: 20%">'+data.data.task.content+'</td>'+
                                    '                    <td style="width: 7%">'+data.data.commentCount+'</td>'+
                                    '                    <td style="width: 7%">'+data.data.love+'</td>'+
                                    '                    <td style="width: 7%" title="接单者名称:'+data.data.re_nickName+'\n 接单者ID: '+data.data.re_userid+'">'+taskStatus(data.data.task.status)+'</td>'+
                                    '                    <td>'+(data.data.task.delFlag==0?"<a style='cursor:pointer;' onclick='deleteTask(\""+data.data.task._id+"\")'>删除</a>":"<a style='cursor:pointer;'>恢复")+'</td>'+
                                    '                </tr>';
                            if(data.data.task.delFlag==0){
                                document.getElementById("exist_display").innerHTML=content;
                                element.tabChange('demo', '111');
                                document.getElementById("task_exist").display = "none";
                            }else if(data.data.task.delFlag==1){
                                document.getElementById("delete_display").innerHTML=content;
                                element.tabChange('demo', '222');
                                document.getElementById("task_delete").display = "none";
                            }
                        }else{
                            layer.msg(data.msg, {icon: 2});

                        }
                        layer.close(index);
                    });
        }
        
    </script>
</head>

<body class="layui-anim layui-anim-up">

<div class="layui-row">
    <input type="text" id="input_task"  placeholder="请输入任务id"  autocomplete="off" class="layui-input" style="float: left;margin: 10px 5px">
    <div  style="line-height:1.6emp:3p;float:right;margin-left: 20px;margin-top: 10px;margin-right: 20px" >
        <button class="layui-btn" onclick="searchTask()"><i class="layui-icon" title="搜索" >&#xe615;</i></button>
        <a class="layui-btn layui-btn-small" href="javascript:location.replace(location.href);" title="刷新">
            <i class="layui-icon" style="line-height:38px">ဂ</i></a>
    </div>
</div>
<div class="layui-tab layui-tab-card" lay-filter="demo">
    <ul class="layui-tab-title">
        <li class="layui-this" lay-id="111">已上线的任务</li>
        <li lay-id="222">已被删除任务</li>
    </ul>
    <div class="layui-tab-content" style="height: 100%;">
        <div class="layui-tab-item layui-show" id="task_exist_display">

            <table class="layui-table">
                <thead>
                <tr>
                    <th>用户id</th>
                    <th>用户名称</th>
                    <th>任务id</th>
                    <th>任务标题</th>
                    <th>任务内容(省略图片)</th>
                    <th>评论数</th>
                    <th>点赞数</th>
                    <th>状态</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody id="exist_display">

                </tbody>
            </table>



            <div id="task_exist" style="text-align: center"></div>
        </div>
        <div class="layui-tab-item"  id="task_delete_display">


            <table class="layui-table">
                <colgroup>
                    <col width="150">
                    <col width="200">
                    <col>
                </colgroup>
                <thead>
                <tr>
                    <th>用户id</th>
                    <th>用户名称</th>
                    <th>任务id</th>
                    <th>任务标题</th>
                    <th>任务内容(省略图片)</th>
                    <th>评论数</th>
                    <th>点赞数</th>
                    <th>状态</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody id="delete_display">

                </tbody>
            </table>



            <div id="task_delete" style="text-align: center"></div>
        </div>
    </div>
</div>
</body>
<script>
    function deleteTask(id){
        layer.confirm('您是否要删除该任务？', {
            btn: ['确定删除','不小心点错'] //按钮
        }, function(){
            $.post("/wlzz/backstage/deleteTask",{id:id},function(data){
                if(data.code==0){
                    layer.msg('删除成功', {icon: 1});
                    var tr = document.getElementById(id);
                    tr.parentNode.removeChild(tr);
                }else{
                    layer.msg(data.msg, {icon: 5});
                }
            })
        }, function(){
            layer.msg('好，点错爸爸原谅你', {icon: 6});
        });


    }
    function taskStatus(status){
        if(status==0){
            return "未接单";
        }else if(status==1){
            return "进行中";
        }else if(status==2){
            return "已完成";
        }

    }
    function reload_task(page,size,status){
        $.post("/wlzz/backstage/allUser_task",
                {page:page,size:size,status:status},function(data){
                    console.log(data);
                    if(data.code==0){
                        var dataList = data.data.dataList;
                        var allContent = "";
                        for(var i = 0;i<dataList.length;i++){
                            var content = ' <tr id="'+dataList[i].task._id+'">'+
                                    '                    <td style="width: 7%">'+dataList[i].userid+'</td>'+
                                    '                    <td style="width: 10%">'+dataList[i].nickName+'</td>'+
                                    '                    <td style="width: 10%">'+dataList[i].task._id+'</td>'+
                                    '                    <td style="width: 20%">'+dataList[i].task.title+'</td>'+
                                    '                    <td style="width: 20%">'+dataList[i].task.content+'</td>'+
                                    '                    <td style="width: 7%">'+dataList[i].commentCount+'</td>'+
                                    '                    <td style="width: 7%">'+dataList[i].love+'</td>'+
                                    '                    <td style="width: 7%" title="接单者名称: '+dataList[i].re_nickName+'\n接单者ID: '+dataList[i].re_userid+'">'+taskStatus(dataList[i].task.status)+'</td>'+
                                    '                    <td>'+(status==0?"<a style='cursor:pointer;' onclick='deleteTask(\""+dataList[i].task._id+"\")'>删除</a>":"<a style='cursor:pointer;'>恢复")+'</td>'+
                                    '                </tr>';
                            allContent = allContent+content;
                        }
                        if(status==0){
                            document.getElementById("exist_display").innerHTML=allContent;
                        }else if(status==1){
                            document.getElementById("delete_display").innerHTML=allContent;
                        }

                    }else{
                        layer.msg(data.msg, {icon: 5});
                    }
            });
    }
    layui.use(['laypage', 'layer'], function() {
        var laypage = layui.laypage
                , layer = layui.layer;
        var laypage = layui.laypage
        laypage.render({
            elem: 'task_exist'
            , count: ${exist_number!""}
            , layout: ['count', 'prev', 'page', 'next', 'skip']
            , limit: 10
            , jump: function (obj) {
                reload_task(obj.curr,obj.limit,0);
            }
        });
        laypage.render({
            elem: 'task_delete'
            , count: ${delete_number!""}
            , layout:  ['count', 'prev', 'page', 'next', 'skip']
            , limit: 10
            , jump: function (obj) {
                // console.log(obj)
                // console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
                // console.log(obj.limit); //得到每页显示的条数
                reload_task(obj.curr,obj.limit,1);
            }
        });
    });
</script>
</html>